<template>
    <Popup ref="popupRef" :form-data="formData" :rules="rules" :title="modeTitle" @submit="handleSubmit"
        @cancel="handleCancel">

        <a-form-item label="名称" field="name">
            <a-input v-model="formData.name" />
        </a-form-item>

        <a-row :gutter="24">
            <a-col :span="12">
                <a-form-item label="联系人" field="contact">
                    <a-input v-model="formData.contact" />
                </a-form-item>
            </a-col>

            <a-col :span="12">
                <a-form-item label="联系电话" field="contact_number">
                    <a-input v-model="formData.contact_number" />
                </a-form-item>
            </a-col>

        </a-row>

        <a-form-item label="负责人" field="curator">
            <a-input v-model="formData.curator" />
        </a-form-item>

        <a-form-item label="备注" field="description">
            <a-textarea v-model="formData.description" />
        </a-form-item>

    </Popup>
</template>

<script setup lang="ts">
import Popup from '@/components/Popup/index.vue'
import { addCompany, editCompany } from '@/api/system/organize/company'
const popupRef = ref<InstanceType<typeof Popup>>()
const emits = defineEmits(['success'])
interface FormData {
    id: number | null
    name: string
    contact: string
    contact_number: number | null
    curator: string
    description: string
}

const formData = reactive<FormData>({
    id: null,
    name: '',
    contact: '',
    contact_number: null,
    curator: '',
    description: ''
})

const rules = {
    name: [
        { required: true, message: '请输入公司名称' }
    ],
    contact: [
        { required: true, message: '请输入联系人' }
    ],
    contact_number: [
        { required: true, message: '请输入联系电话' },
        { pattern: /^1[3-9]\d{9}$/, message: '请输入正确的联系电话' }
    ],
    curator: [
        { required: true, message: '请输入负责人' }
    ]
}

const mode = ref<string | 'add' | 'edit'>('add')
const modeTitle = computed(() => {
    return mode.value === 'add' ? '新增' : '编辑'
})


const open = (type: string | 'add' | 'edit') => {
    mode.value = type
    popupRef.value?.open()
}

const handleSubmit = async () => {
    try {
        mode.value === 'add' ? await addCompany(formData) : await editCompany(formData)
        popupRef.value?.close()
        popupRef.value?.closeLoading()
        emits('success', formData)
    } catch (error) {
        popupRef.value?.closeLoading()
    }
}

const setFormData = async (record: Record<any, any>) => {
    if (record) {
        // 使用解构赋值来合并数据

        for (const key in formData) {
            if (record[key] != null && record[key] != undefined) {
                //@ts-ignore
                formData[key] = record[key]
            }
        }

        // Object.assign(formData, rest)
        // 确保弹窗组件也更新了数据
        nextTick(() => {
            popupRef.value?.setFormData(formData)
        })
    }

}
const handleCancel = () => {
    popupRef.value?.close()
}

defineExpose({
    open,
    setFormData
})
</script>
